<template>
  <ContentWrap>
    <el-tabs v-model="currentTab">
      <el-tab-pane label="通用设置" name="settingForm">
        <SettingForm ref="settingFormRef" :formData="formData" />
      </el-tab-pane>
      <el-tab-pane label="关于我们" name="aboutForm">
        <AboutForm ref="aboutFormRef" :formData="formData" />
      </el-tab-pane>
      <el-tab-pane label="客服二维码" name="qrcodeForm">
        <QrcodeForm ref="qrcodeFormRef" :formData="formData" />
      </el-tab-pane>
    </el-tabs>
    <div class="flex-center">
      <el-button @click="handleSubmitForm" type="primary" :disabled="formLoading">确 定</el-button>
    </div>
  </ContentWrap>
</template>

<script setup lang="ts">
import { DICT_TYPE } from '@/utils/dict'
import { dateFormatter } from '@/utils/formatTime'
import download from '@/utils/download'
import { SettingApi, SettingVO } from '@/api/exam/setting'
import SettingForm from './SettingForm.vue'
import AboutForm from './AboutForm.vue'
import QrcodeForm from './QrcodeForm.vue'
/** 基础设置 列表 */
defineOptions({ name: 'ExamSetting' })

const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const queryParams = reactive({
  pageNo: 1,
  pageSize: 1
})
const currentTab = ref('settingForm')
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formData = ref({
  id: undefined,
  payOpen: undefined,
  bannerHeight: undefined,
  shareupper: undefined,
  shareTitle: undefined,
  isDisplay: undefined,
  displayNum: undefined,
  useIntegralNum: undefined,
  franction: undefined,
  paperTime: undefined,
  rewardIntegral: undefined,
  medal: undefined,
  shareIntegral: undefined,
  about: undefined,
  wechatNumber: undefined,
  standard: undefined,
  pass: undefined,
  good: undefined,
  excellent: undefined,
  countdown: undefined,
  countdowntime: undefined,
  timeDisplay: undefined,
  studentOpen: undefined,
  freepoolnum: undefined,
  freeknowledgenum: undefined,
  infoStatus: undefined,
  ios: undefined,
  customerService: undefined,
  status: 0,
  sort: undefined
})
/** 查询列表 */
const getList = async () => {
  formLoading.value = true
  try {
    const data = await SettingApi.getSettingPage(queryParams)
    if(data.list&&data.list.length>0){
      formData.value = data.list[0]
      console.log(formData)
    }
  } finally {
    formLoading.value = false
  }
}
const settingFormRef = ref()
const aboutFormRef = ref()
const qrcodeFormRef = ref()
const handleSubmitForm = async () => {
  try {
    // 校验表单
    await settingFormRef.value.validateForm()
  } catch (err) {
    currentTab.value = 'settingForm'
    return
  }
  try {
    // 校验表单
    await aboutFormRef.value.validateForm()
  } catch (err) {
    console.log(err)
    currentTab.value = 'aboutForm'
    return
  }
  try {
    // 校验表单
    await qrcodeFormRef.value.validateForm()
  } catch (err) {
    console.log(err)
    currentTab.value = 'qrcodeForm'
    return
  }
  // 提交请求
  formLoading.value = true
  try {
    const data = formData.value as unknown as SettingVO
    data.franction = JSON.stringify(data.franction)
    if (data.id > 0) {
      await SettingApi.updateSetting(data)
      message.success(t('common.updateSuccess'))
    } else {
      await SettingApi.createSetting(data)
      message.success(t('common.createSuccess'))
    }
    await getList()
  } finally {
    formLoading.value = false
  }
}
/** 初始化 **/
onMounted(() => {
  getList()
})
</script>